<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%-- 
	菜单管理主页面 @azzcsimp
	该页涵盖了dwz的异步加载、layoutH处理(未完善)、动态Tab页展示、单NavTab多个Form表单提交、
	单NavTab多分页查询、动态递归树形展示、树形重载、树形target控制等问题。
	
	需要注意的是3个hidden input的作用
		treeData_${status.index}   ： 对应tab中需要加载的树形结构原数据对象。${menuMap.value}
		relId_${status.index}      ： 对应tab中需要异步加载的div命名用后缀。  ${fn:substringAfter(menuMap.key, "-")}   
		changeFlag_${status.index} ： 对应tab点击事件，默认值为空，点击后更改该值为changed。
									    解决避免每次点击都执行loadUrl异步加载，仅在第一次点击时进行加载(非DWZ内置加载)。
    为什么进入页面需要把所有树形展示完而不放在changeTab(index)中进入后加载展示。因为放在changeTab(index)树形加载不正常。
 --%>
<script type="text/javascript">
jQuery(function($) {
	
	// 获取name为menuTree的对象 menuTree的个数取决与系统字典个数
	var menuTreeDiv = $("[name='menuTree']", navTab.getCurrentPanel());
	
	 // 遍历menuTree对象
	for(var i=0;i<menuTreeDiv.length;i++){ 
		showMenuTree(i);
	}
	 
	// 切换tab
	changeTab(0);
});

/** 根据索引index初始化显示tree菜单 */
function showMenuTree(index){
	// 获取需要展示的对象
	var tree = $("#menuTree_" + index, navTab.getCurrentPanel());
	// 获取存储rel值的对象
	var hiIptRelId = $("#relId_" + index, navTab.getCurrentPanel());
	// 获取存储treeData值的对象
	var hiIptTreeData = $("#treeData_" + index, navTab.getCurrentPanel());
	// 调用通用递归展示tree函数
	tree.html(getDWZTreeHTML(
					eval('(' + hiIptTreeData.val() + ')'),// data
					"", // pId
					"menuAuth_list.action", // href
					"parentId", // param
					"rel_" + hiIptRelId.val(),// rel
					"&relId=rel_" + hiIptRelId.val() + "&sysNameDc=" + hiIptRelId.val()
			).replaceAll("<ul></ul>",""));
}


/** tab单击事件 */
function changeTab(index){
	var relIdValue = $("#relId_" + index, navTab.getCurrentPanel()).val();
	if($("#changeFlag_"+index, navTab.getCurrentPanel()).val() != "changed"){
		// 异步加载该系统菜单列表
		$("#rel_"+relIdValue, navTab.getCurrentPanel()).loadUrl("menuAuth_list.action",{"relId":"rel_" + relIdValue,"sysNameDc":relIdValue}, function(){
			/* // 回调函数处理layoutH
			var iRefH = $("#rel_" + relIdValue, navTab.getCurrentPanel()).parents("div.layoutBox:first").height();
			var iH = iRefH - 155 > 50 ? iRefH - 155 :50;
			$("div[class=gridScroller]",navTab.getCurrentPanel()).height(iH).css("overflow","auto");  */
			$("#rel_"+relIdValue, navTab.getCurrentPanel()).find("[layoutH]").layoutH();
		});
		
		// 更改该tab的切换状态
		$("#changeFlag_" + index, navTab.getCurrentPanel()).val("changed");
	}
	$("#sysCode", navTab.getCurrentPanel()).val(relIdValue);
}

function menuDialogAjaxDone(json){
 	dialogAjaxDone(json);
 	reloadTree();
}

function menuDelAjaxDone(json){
	navTabAjaxDone(json);
	reloadTree();
}

function reloadTree(){
	// 获取name为menuTree的对象 menuTree的个数取决与系统字典个数
	var treeNum = $("[name='menuTree']", navTab.getCurrentPanel()).length;
	getTreeBySys(treeNum-1);
}

function getTreeBySys(index){
	if( index >= 0 ){
		var sysDc = $("#relId_" + index, navTab.getCurrentPanel()).val();
		$.post("menuAuth_getMenuTreeData.action", 
	 			{"sysNameDc": sysDc}
		, function(data) {
			$("#treeData_" + index, navTab.getCurrentPanel()).val(data);
			showMenuTree(index);
			$("#menuTree_" + index +":first .tree", navTab.getCurrentPanel()).jTree();
			$("a[target=ajax]", $("#menuTree_" + index +":first .tree", navTab.getCurrentPanel())).each(function(){
				$(this).click(function(event){
					var $this = $(this);
					var rel = $this.attr("rel");
					if (rel) {
						var $rel = $("#"+rel);
						$rel.loadUrl($this.attr("href"), {}, function(){
							$rel.find("[layoutH]").layoutH();
						});
					}
					event.preventDefault();
				});
			});
			
			getTreeBySys(index-1);
			
		}, "text");
	}
}

function doSelect(obj){
	var sysCode = $("#sysCode", navTab.getCurrentPanel()).val();
	var flagText = $("#menu_setFlagText_"+sysCode, navTab.getCurrentPanel());
	var flagLink = $("#menu_setFlagLink_"+sysCode, navTab.getCurrentPanel());
	var falgValue = $("#menu_flag_"+sysCode+"_"+obj.rowIndex, navTab.getCurrentPanel()).val();
	if(falgValue==0){
		flagText.text("启用");
		flagLink.attr("title","确定要启用该菜单吗？")
		flagLink.attr("class","icon-ok");
	}else if(falgValue==1){
		flagText.text("停用");
		flagLink.attr("title","确定要停用该菜单吗？")
		flagLink.attr("class","icon");
	}else{
		flagText.text("停用/启用");
		flagLink.attr("class","icon");
	}
}
</script>

<div class="pageContent" >
	<input id="sysCode" type="hidden" value="">
	<div class="tabs" currentIndex="0" eventType="click">
		<div class="tabsHeader">
			<div class="tabsHeaderContent">
				<ul>
					<c:forEach var="menuMap" items="${menuMap}" varStatus="status">
						<li onclick="javascript:changeTab('${status.index}');" ><a href="javascript:;"><span>${menuMap.key}</span></a></li>
					</c:forEach>
				</ul>
			</div>
		</div>
		<div class="tabsContent" layoutH="39">
			<c:if test="${empty menuMap }">
				<div style="text-align: center;color: red;">
					*&nbsp;&nbsp;当前系统未初始化字典信息，没有匹配的系统需要做菜单管理！
				</div>
			</c:if>
			<c:forEach var="menuMap" items="${menuMap}" varStatus="status">
				<div>
					<input id="treeData_${status.index }" type="hidden" value="${menuMap.value}">
					<input id="relId_${status.index }" type="hidden" value="${fn:substringAfter(menuMap.key, '-')}">
					<input id="changeFlag_${status.index }" type="hidden" value=""> 
					<div name="menuTree" id="menuTree_${status.index }" layoutH="41"
						 style="float:left; display:block; overflow:auto; width:240px; border:solid 1px #CCC; line-height:21px; background:#fff">
					</div>
					
					<div id="rel_${fn:substringAfter(menuMap.key, '-')}" class="unitBox"   style="margin-left:246px;">
					</div>
				</div>
			</c:forEach>
		</div>
		<div class="tabsFooter">
			<div class="tabsFooterContent"></div>
		</div>
	</div>
</div>